import React from 'react'

class CommentBox extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            comment: ''
        }
        this.handleChange = this.handleChange.bind(this)
        this.handleSubmit = this.handleSubmit.bind(this)
    }
    handleChange( event ){
        console.log(event.target.value);
        this.setState({
            comment: event.target.value
        })
    }
    handleSubmit( event ) {
        alert(this.state.comment)
        event.preventDefault()
    }

    render(){
        return (
            <form className='p-5' onSubmit={this.handleSubmit}>
                <div className="form-group">
                    <label>留言内容</label>
                    <input type="text" className="form-control"
                        placeholder="请输入内容"
                        onChange={this.handleChange}
                        value={this.state.comment}/>
                </div>
                <button type="submit" className="btn btn-primary">COMMENT</button>
            </form>
        )
    }
}

export default CommentBox